import 'package:bilibili/provider/theme_provider.dart';
import 'package:hi_common/util/color.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';

class ThemeTogglePage extends StatefulWidget {
  const ThemeTogglePage({super.key});

  @override
  State<StatefulWidget> createState() {
    return _ThemeTogglePageState();
  }
}

class _ThemeTogglePageState extends State<ThemeTogglePage> {
  final Map<String, ThemeMode> _items = {
    "跟随系统": ThemeMode.system,
    "开启": ThemeMode.dark,
    "关闭": ThemeMode.light
  };

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    var keys = _items.keys.toList();
    return Scaffold(
      appBar: AppBar(
        title: const Text("夜间模式"),
      ),
      body: ListView.separated(
          itemBuilder: (BuildContext context, int index) {
            var key = keys[index];
            var mode = _items[key];
            return _buildItem(key, mode!);
          },
          separatorBuilder: (BuildContext context, int index) =>
              const Divider(),
          itemCount: keys.length),
    );
  }

  _buildItem(String key, ThemeMode mode) {
    ThemeMode currentMode = context.watch<ThemeProvider>().mode;
    return InkWell(
      onTap: () {
        context.read<ThemeProvider>().toggleMode(mode);
      },
      child: Padding(
        padding:
            const EdgeInsets.only(left: 10, right: 10, top: 10, bottom: 10),
        child: Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Text(key),
            Opacity(
              opacity: currentMode == mode ? 1 : 0,
              child: const Icon(
                Icons.check,
                color: primary,
              ),
            )
          ],
        ),
      ),
    );
  }
}

void main() => runApp(const ProfilePageApp());

class ProfilePageApp extends StatelessWidget {
  const ProfilePageApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      home: ThemeTogglePage(),
    );
  }
}
